body {
    margin: 0;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.header {
    position:fixed;
    top:0;
    width: 100%;
    background-color: #f1f1f1;
    padding: 15px;
    text-align: center;
    z-index: 1000; 
}
.h{
    text-decoration: none;
    font-size: larger;
    font-weight: 20px;
    padding: 15px;
    margin-left: 30px;
    color: blue;
}
.p{
  margin-left: 220px;
}
.search-container {
    padding: 5px;
    margin-top: 2px;
    margin-left: 30px;
    border: 3px solid #ccc;
    border-radius: 20px;
    font-size: 12px;
    box-sizing: border-box;
    
}
.logo{
    font-weight: 30px;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 30px;
    color: darkmagenta;
    text-decoration: none;
    margin-left:-5px;
  }
  #follow{
    margin-top: 30px;
margin-left: 30px;
}
#query{
    margin-top: 10px;
margin-left: 20px;
}
.chat{
background-color:blueviolet; 
border-radius:30px;
color: white;
padding: 15px 30px;
text-align: center;
text-decoration: none;
font-size: 16px;
margin: 4px 2px;
margin-left: 20px;
cursor: pointer;
}
.social{
width: 30px;
height: 30px;
}
.social_media a{
    padding: 15px;
}
.uparrow{
width:50px;
height:50px;
float:right;
margin-top:-50px;
}
#k{
    margin-top: 100px;
    margin-left: 20px;
}
.products {
    width: 100%;
    margin-top: 50px;
    margin-left: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    padding: 32px 10px;
    gap: 70px;
    max-width: 1200px;
    }
    .product {
        width: 200px;
        }
        
        .product img {
        width: 200px;
        height: 200px;
        object-fit: fill;
        }
        
        .product h3 {
        padding: 16px 0;
        text-align: center;
        }
        .img{
            margin-top: 25px;
        }
.products_footer{
  margin-left: 570px;
  margin-top:-210px;
    }
    .solutions_footer{
    margin-top: -280px;
    margin-left: 280px;
    }
    .news_footer{
      margin-left: 730px;
      margin-top:-150px;
    }
    .address_footer{
      margin-top: -230px;
  margin-left: 980px;
    }
    .left{
        background-color: #f1f1f1;
        height: 350px;

    }
    @media (max-width:700px){
        .logo{
            font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
            font-size: 30px;
            color: darkmagenta;
            text-decoration: none;
            margin-left: -30px;
          }
          .header {
              position: fixed;
              width: 100%;
              background-color: #f1f1f1;
              text-align: center;
              z-index: 1000; 
          }
          .header a {
              text-decoration: none;
              font-size: 10px;
              font-weight: 30px;
              padding: 1px;
          }
          .h{
              text-decoration: none;
              font-size: larger;
              font-weight: 20px;
              padding: 5px;
              margin-left: 12px;
          }
          .p{
            margin-left: 30px;
          }
          .search-container {
              padding: 2px;
              margin-left: 12px;
              margin-top: 2px;
              border: 1px solid #ccc;
              border-radius: 20px;
              font-size: 5px;
              box-sizing: border-box;
          }
          .products {
            width: 100%;
            margin: 0 auto;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap;
            padding: 32px 10px;
            gap: 32px;
            max-width: 400px;
            }
            
            .product {
            width: 200px;
            }
            
            .product img {
            width: 200px;
            height: 200px;
            object-fit: fill;
            }
            
            .product h3 {
            padding: 16px 0;
            text-align: center;
            }
          #k{
            margin-left: 200px;
            font-size: small;
          }
          h3{
            font-size: small;
          }
          #query{
            margin-left: 35px;
            font-size: 10px;
          }
          .chat{
          background-color:blueviolet; 
          border-radius:30px;
          color: white;
          padding: 5px 10px;
          text-align: center;
          text-decoration: none;
          font-size: 8px;
          margin: 4px 2px;
          margin-left: 30px;
          cursor: pointer;
          }
          #follow{
            margin-top: -30px;
            margin-left: 30px;
            font-size: 10px;
          }
          .social_media a{
            margin-left: 20px;
            padding: 5px;
            text-decoration: none;
            }
          
        .social{
            width: 10px;
            height: 10px;
        }
        .uparrow{
                width:15px;
                 height:15px;
                 float:right;
                 margin-top: -40px;
        }
        .products_footer{
                    margin-left: 150px;
                    margin-top:-150px;
                    font-size: 10px;
        }
        .solutions_footer{
                    margin-top: -160px;
                    margin-left: 250px;
                    font-size: 10px;
        }
        .news_footer{
                    margin-left: 180px;
                    margin-top:80px;
                    font-size: 10px;
        }
        .address_footer{
                    margin-top: -130px;
                    margin-left: -10px;
                    font-size: 10px;
        }
 

    }
    @media (min-width:700px) and (max-width:1200px){
        .header {

            position: fixed;
            width: 100%;
            background-color: #f1f1f1;
            text-align: center;
            z-index: 1000; 
        }
        .header a {
            text-decoration: none;
            font-size: 12px;
            font-weight: 30px;
            padding: 2px;
        }
        .logo{
          font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
          color: darkmagenta;
          text-decoration: none;
          margin-left: -30px;
        }
        .h{
            text-decoration: none;
            font-size: larger;
            font-weight: 20px;
            padding: 5px;
            margin-left: 12px;
        }
        h3{
            font-size: small;
        }
        .p{
          margin-left: 100px;
        }
        .search-container {
            padding: 3px;
            margin-left: 12px;
            margin-top: 2px;
            border: 3px solid #ccc;
            border-radius: 20px;
            font-size: 6px;
            box-sizing: border-box;
        }
        .social_media a{
            padding: 12px;
            text-decoration: none;
            }
            .products {
                width: 100%;
                margin: 0 auto;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-wrap: wrap;
                padding: 32px 10px;
                gap: 32px;
                max-width: 600px;
                }
                
                .product {
                width: 200px;
                }
                
                .product img {
                width: 200px;
                height: 200px;
                object-fit: fill;
                }
                
                .product h3 {
                padding: 16px 0;
                text-align: center;
                }
                #query{
                    margin-left: 35px;
                    font-size: 10px;
                  }
                  .chat{
                  background-color:blueviolet; 
                  border-radius:30px;
                  color: white;
                  padding: 5px 10px;
                  text-align: center;
                  text-decoration: none;
                  font-size: 8px;
                  margin: 4px 2px;
                  margin-left: 30px;
                  cursor: pointer;
                  }
          
        #follow{
            margin-top: -20px;
            margin-left: 30px;
            font-size: 10px;
          }
          .social{
            width: 15px;
            height: 15px;
            
            }
            .uparrow{
                width: 18px;
                 height:18px;
                 float:right;
                 margin-top:-50px;
                }
                .products_footer{
                    margin-left: 230px;
                    margin-top:-100px;
                    font-size: 10px;
                  }
                  .solutions_footer{
                    margin-top: -160px;
                    margin-left: 380px;
                    font-size: 10px;
                  }
                  .news_footer{
                    margin-left: 230px;
                    margin-top:100px;
                    font-size: 10px;
                  }
                  .address_footer{
                    margin-top: -120px;
                    margin-left: -10px;
                    font-size: 10px;
                  }
    }